<template>
  <div>
    <van-nav-bar
      title="确认订单"
      left-arrow
      @click-left="$router.back()"
    />

    <van-cell title="订单编号" :value="order.order_sn"></van-cell>
    <van-cell title="订单金额" :value="order.order_price"></van-cell>
    <van-cell title="请选择支付方式"></van-cell>
    <van-cell>
       <template #title>
         <van-checkbox v-model="checked" checked-color="#ee0a24" class="fontSize"> <i class="toutiao-weixinzhifu"></i> 微信支付</van-checkbox>
       </template>
    </van-cell>
    <van-button type="primary" class="fixed" color="#e11c34" @click="btnOK">确定</van-button>

    
  </div>
</template>

<script>
import {orderDetail} from '@/api/gaoqing/shopping'
export default {
  name: 'PaymentOrder',
  data() {
    return {
      checked: true,
      order: {}
    }
  },
  created () {
    this.orderInfo()
  },
  methods: {
    async orderInfo() {
      let {data} = await orderDetail({ orderId:this.$route.params.id})
      console.log(data.data);
      this.order = data.data.orderInfo
    },
    // 点击成功弹出
    btnOK(){
      this.$dialog.alert({
        title: '支付成功',
      }).then(() => {
        // console.log(111);
        this.$router.push('/shopping')
      })
    }
  },
}
</script>

<style lang="less" scoped>
/deep/ .van-nav-bar__content {
  background-color: #e11c34;
}
/deep/ .van-nav-bar__title {
  color: #fff;
}
/deep/ .van-nav-bar .van-icon{
  color: #fff;
}
.fontSize{
  font-size: 30px;
}
.fixed{
  position: fixed;
  bottom: 0;
  width: 100%;
}
</style>